<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>

		<h1>鼠标事件</h1>
		<ul>
			<li>onclick</li>
			<li>ondclick</li>
			<li>onmousedown</li>
			<li>onmouseup</li>
			<li>onmouseover</li>
			<li>onmouseout</li>
			<li>onmousemove</li>
		</ul>
		<div id="div01" style="width: 300px;height: 300px;background-color: lightblue;">


		</div>
		<script type="text/javascript">
			div01.onclick = function() {
				div01.textContent = "鼠标单击"
			};
			div01.ondbclick = function() {
				div01.textContent = "鼠标双击"
			};
			div01.onmousedown = function() {
				div01.textContent = "鼠标按下"
			};
			div01.onmouseup = function() {
				div01.textContent = "鼠标抬起"
			};
			div01.onmouseover = function() {
				div01.textContent = "鼠标移入"
			};
			div01.onmouseout = function() {
				div01.textContent = "鼠标移出"
			};
			div01.onmousemove = function() {
				div01.textContent = "鼠标移动" + event.clientX + "," + event.clientY
			};
		</script>

		<!-- 
			练习1
			
		-->
	</body>
</html>
